<template>
	<view>
		<view class="whiteLine mtb20" @click="prePage(info)">
				<view class="flexR between" style="padding: 10px 10px 2px;">
					<view class="flexC" style="height: 80px;">
						<view>
							<image class="imgs" mode="widthFix" src="@/static/imgs/icon-tip.png"></image>
							<span v-if="type!=2" class="info">{{ info.name+'('+info.deviceSensibility.deviceNo+')' }}</span>
							<span v-else class="info">{{ info.deviceNo }}</span>
							
						</view>
						<view class="flow"></view>
						<view v-if="type!=2" style="margin-bottom: -2px;">
							<view class="tt">温度：{{info.deviceSensibility.temperature}}℃</view>
							<view class="tt">湿度：{{info.deviceSensibility.humidity}}%</view>
						</view>
					</view>
					<view v-if="type!=2">
						<view :class="['online', info.onlineStatus==1?'green':'red']">
							{{ info.onlineStatus==1 && '在线' || '离线' }}
						</view>
					</view>
				</view>
				<view v-if="type!=2"  style="padding: 0 10px 0;">
					<span class="tt kk">空气颗粒度0.3μm：<span class="flow"></span>{{info.deviceSensibility.particle3}}个/L</span>
					<span class="tt kk">空气颗粒度0.5μm：<span class="flow"></span>{{info.deviceSensibility.particle5}}个/L</span>
					<span class="tt kk">空气颗粒度1.0μm：<span class="flow"></span>{{info.deviceSensibility.particle10}}个/L</span>
					<span class="tt kk">空气颗粒度2.5μm：<span class="flow"></span>{{info.deviceSensibility.particle25}}个/L</span>
					<span class="tt kk">空气颗粒度5.0μm：<span class="flow"></span>{{info.deviceSensibility.particle50}}个/L</span>
					<span class="tt kk">空气颗粒度10.0μm：<span class="flow"></span>{{info.deviceSensibility.particle100}}个/L</span>
				</view>
				<view class="line" style="margin-top: 10px;"></view>
				<view class="p10 flexR">
					<image class="imgs" mode="widthFix" src="@/static/imgs/icon-time.png"></image>
					<span class="c80">{{getTime(info.deviceSensibility.date || info.deviceSensibility.flvTimestamp*1000)}}</span>
					<view class="flow"></view>
					<image class="imgs" mode="widthFix" src="@/static/imgs/icon-localtion.png"></image>
					<span class="c80">{{info.address || '暂无'}}</span>
				</view>
			</view>
	</view>
</template>

<script>
import { parseTime } from '@/utils/index'

export default {
	props: ['info', 'type'],
	data() {
		return {
			title: 'page',
		};
	},
	created() {
	},
	computed: {
		
	},
	methods: {
		prePage(v) {
			uni.navigateTo({
				url: `/pages/preview?type=${this.type}&info=${JSON.stringify(v)}`
			});
		},
		getTime(v) {
			if(!v) return '--'
			return parseTime(v)
		}
	}
}
</script>

<style lang="scss">
.kk {
	display: flex;
	justify-content: space-between;
	width: 100%;
}
.video, .video2 {
	width: 140px;
	height: 80px;
	border-radius: 4px;
}
.online {
	width: 3rem;
	color: #fff;
	text-align: center;
}
.green {
	background: green;
	border-radius: 4px;
}
.red {
	background: red;
	border-radius: 4px;
}
.bg {
	width: 100%;
	position: absolute;
	top: 0;
	z-index: -1;
}
.info {
	font-weight: bold;
}
.imgs {
	width: 15px;
	height: 15px;
	margin-right: 5px;
}
</style>
